<template>
  <!--精品课-->
  <div>
    <div>
      <div class="xscroll" ref="wrapper">
        <ul>
          <li v-for=" n in course">
            <img :src='URL + n.bigimg' alt="">
            <div class="bouitque_content">
              <h5>{{n.title}}</h5>
              <p><span><b>￥{{n.price}}币 </b><i> {{n.originalPrice}}币</i></span></p>
              <p><span>{{n.bookCount}}节课{{n.virtualClickCount}}</span></p>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
    export default {
        name: "Boutique",
    data(){
          return{
            course:[],//精品课
          }
    },
      components:{

      },
      mounted(){
        let date = Math.round(new Date() / 1000)//获取当前时间戳
        let obj ={page :1,rows:'10',timestamp:date,token :0,type:0}
        let sign =  this.md5(this.objKeySort(obj)+'44543e5367854cfcbb3a867f32fa64a2')//加密
        let url = 'https://testapi.readerday.com/v3/product/theme/list/0/' + sign +'/'+ date +'/1/10/0'
        this.$axios.get(url)
          .then((res)=>{
            this.course=[]
            this.course=res.data.data.list

            console.log(this.course)
          })
      }
    }
</script>

<style scoped>
  .scrolltitle{
    margin-bottom: .15rem;
    margin-top: .15rem;
    font-weight: bold;
  }
  .scrolltitle span{
    float: right;
    font-size: .12rem;
    font-weight: normal;
    margin-right: .15rem;
  }
  .bouitque_content{
    text-align: left;
  }
  .bouitque_content h5{
    font-size: .14rem;
    line-height: .25rem;
    font-weight: 500;
  }
  .bouitque_content p{
    font-size: .12rem;
    line-height: .25rem;
  }
  .xscroll {
    width: 100%;
  }
  .xscroll li{
    width: 100%;
    height: 2.5rem;
    padding: 0 .1rem;
  }
  .xscroll ul{
  }
  .xscroll img{
    height: 60%;
    width: 100%;
  }
</style>
